<template>
  <div class="app-container">
    <el-row style="background-color: #f1f1f1;padding: 20px;">
      <el-col :span="24">
        <div class="home-img-box">
          <img :src="IMGURL + brandInfo.imgKey" alt="" v-if="brandInfo.imgKey">
        </div>
        <span style="line-height: 28px;margin-left: 10px">{{brandInfo.name}}</span>
        <!--<span style="float:right;line-height: 28px">查看全部未读（0）</span>-->
      </el-col>
    </el-row>
    <el-row :gutter="20">
      <el-col :span="12" class="home-main">
        <div>
          <h1>今日有效订单</h1>
          <h1>{{today_valid_order}} <span>单</span></h1>
          <h2>昨日{{yesterday_valid_order}}单</h2>
        </div>
      </el-col>
      <el-col :span="12" class="home-main">
        <div>
          <h1>今日订单收入</h1>
          <h1><span>￥</span>{{turnover}}</h1>
          <!--<h2>昨日8单</h2>-->
        </div>
      </el-col>
    </el-row>
    <el-row :gutter="20">
      <el-col :span="8" class="home-div">
        <div>
          <h1>未接订单</h1>
          <h2>{{not_received_order}}</h2>
        </div>
      </el-col>
      <el-col :span="8" class="home-div">
        <div>
          <h1>待配送订单</h1>
          <h2>{{not_delivery_order}}</h2>
        </div>
      </el-col>
      <el-col :span="8" class="home-div">
        <div>
          <h1>待退款订单</h1>
          <h2>{{not_fund_order}}</h2>
        </div>
      </el-col>
    </el-row>
  </div>
</template>
<script>
  import { getUserInfo, home_number } from '@/api'
  import { IMGURL } from '@/utils/imgurl'

  export default {
    data() {
      return {
        websock: null,
        brandInfo: {},
        IMGURL: IMGURL,
        today_valid_order: 0,
        yesterday_valid_order: 0,
        turnover: 0,
        not_received_order: 0,
        not_delivery_order: 0,
        not_fund_order: 0
      }
    },
    methods: {
      getUser() {
        getUserInfo().then(res => {
          console.log(res)
          this.brandInfo = res.brand
          this.getNum()
        })
      },
      getNum() {
        home_number().then(res => {
          console.log(res, 123)
          this.today_valid_order = res[0].today_valid_order
          this.yesterday_valid_order = res[1].yesterday_valid_order
          this.turnover = res[2].turnover
          this.not_received_order = res[3].not_received_order
          this.not_delivery_order = res[4].not_delivery_order
          this.not_fund_order = res[5].not_fund_order
        })
      }
    },
    mounted() {
      this.getUser()
    }
  }
</script>

<style lang='scss'src="./index.scss"></style>
